import 'dart:async';

import 'package:fish_redux/fish_redux.dart';
import 'package:flutter/material.dart' hide Action;
import 'package:flutter_spinkit/flutter_spinkit.dart';

import 'action.dart';
import 'state.dart';

Widget buildView(
    MessageListState state, Dispatch dispatch, ViewService viewService) {
  final ListAdapter adapter = viewService.buildAdapter();
  final ScrollController _scrollController = new ScrollController();
  _scrollController.addListener(() {
    // 如果下拉的当前位置到scroll的最下面
    if (_scrollController.position.pixels ==
        _scrollController.position.maxScrollExtent) {
      dispatch(MessageListActionCreator.onLoad());
    }
  });

  List<Widget> _listView() {
    var widgets = <Widget>[];
    if (adapter.itemCount == 0) {
      if (!state.isLoading) {
        widgets.add(Center(
            child: Column(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            Image.asset("assets/images/empty.png",
                width: 150, fit: BoxFit.fill),
            Text('没有找到系统消息', style: TextStyle(color: Colors.grey))
          ],
        )));
      }
    } else {
      widgets.add(ListView.separated(
        physics: AlwaysScrollableScrollPhysics(),
        // work when several items
        itemBuilder: (context, index) {
          if (index == adapter.itemCount) {
            return Padding(
              padding: const EdgeInsets.all(8.0),
              child: new Center(
                child: new Opacity(
                  opacity: state.isLoading ? 0.0 : 1.0,
                  child: Text(index != 0 ? '没有更多了' : '',
                      style: TextStyle(color: Colors.grey)),
                ),
              ),
            );
          } else {
            return adapter.itemBuilder(context, index);
//            return Slidable(
//                key: ValueKey(index),
//                actionPane: SlidableDrawerActionPane(),
//                secondaryActions: <Widget>[
//                  IconSlideAction(
//                    caption: '删除',
//                    color: Colors.red,
//                    icon: Icons.delete,
//                    onTap: () =>
//                        dispatch(MessageListActionCreator.onDelete(index)),
//                  ),
//                ],
//                dismissal: SlidableDismissal(
//                  child: SlidableDrawerDismissal(),
//                ),
//                child: adapter.itemBuilder(context, index));
          }
        },
        itemCount: adapter.itemCount + 1,
        controller: _scrollController,
        separatorBuilder: (context, index) {
          return Divider(height: 1);
        },
      ));
    }

    if (state.isLoading) {
      widgets.add(Center(
          child: SizedBox(
              width: 110,
              height: 110,
              child: Card(
                  key: null,
                  color: Colors.black45,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(15.0),
                  ),
                  child: Column(
                    mainAxisAlignment: MainAxisAlignment.center,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisSize: MainAxisSize.min,
                    children: <Widget>[
                      SpinKitFadingCircle(
                        color: Colors.blue,
                        size: 50,
                      ),
                      Padding(
                        padding: const EdgeInsets.only(
                          top: 20.0,
                        ),
                        child: new Text(
                          "正在加载...",
                          style: TextStyle(fontSize: 12.0, color: Colors.white),
                        ),
                      ),
                    ],
                  )))));
    }

    return widgets;
  }

  return Scaffold(
    appBar: AppBar(
      centerTitle: true,
      backgroundColor: state.themeColor,
      title: const Text('系统通知'),
    ),
    body: Container(
      child: Column(
        children: <Widget>[
          Expanded(
            child: RefreshIndicator(
              child: Stack(
                children: _listView(),
              ),
              onRefresh: () {
                final Completer<void> completer = Completer<void>();
                dispatch(MessageListActionCreator.onReload(
                    () => completer.complete()));
                return completer.future;
              },
            ),
          )
        ],
      ),
    ),
  );
}
